<template>
  <el-form ref="editFormRef" :model="form" v-loading="loading">
    <pub-edit-description :labelWidth="165" :ndColumns="2">
      <pub-edit-description-item :span="1" label="角色名称" required>
        <el-form-item prop="name" :rules="$formRules.input">
          <pub-input v-model="form.name" />
        </el-form-item>
      </pub-edit-description-item>
      <!-- <pub-edit-description-item :span="1" label="机构类型" required>
        <el-form-item prop="orgType" :rules="$formRules.select">
          <orgTypeList type="String" v-model="form.orgType" />
        </el-form-item>
      </pub-edit-description-item> -->
      <pub-edit-description-item :span="1" label="平台类型" required>
        <el-form-item prop="platform" :rules="$formRules.select">
          <pub-select-dict
            width="100%"
            v-model="form.platform"
            dict-code="SYS_PTLX"
            placeholder="请选择"
          />
        </el-form-item>
      </pub-edit-description-item>
      <pub-edit-description-item :span="1" label="角色编号" required>
        <el-form-item prop="code" :rules="$formRules.input">
          <pub-input v-model="form.code" />
        </el-form-item>
      </pub-edit-description-item>
      <pub-edit-description-item :span="1" label="状态" required>
        <el-form-item prop="status" :rules="$formRules.select">
          <el-switch
            v-model="form.status"
            active-color="#13ce66"
            inactive-color="#ff4949"
            :active-value="1"
            :inactive-value="0"
          />
        </el-form-item>
      </pub-edit-description-item>
      <pub-edit-description-item :span="1" label="一级菜单是否顶部展示" required>
        <el-form-item prop="topMenu" :rules="$formRules.select">
          <pub-radio-dict v-model="form.topMenu" dict-code="SF" type="Number" />
        </el-form-item>
      </pub-edit-description-item>
      <pub-edit-description-item :span="1" label="是否进入引导页" required>
        <el-form-item prop="enterIndex" :rules="$formRules.select">
          <pub-radio-dict v-model="form.enterIndex" dict-code="SF" type="Number" />
        </el-form-item>
      </pub-edit-description-item>
      <pub-edit-description-item :span="2" label="备注">
        <el-form-item prop="remark">
          <pub-textarea v-model="form.remark" />
        </el-form-item>
      </pub-edit-description-item>
    </pub-edit-description>
  </el-form>

  <div class="dialog-footer-btn">
    <el-button type="default" @click="close()">取消</el-button>
    <el-button
      v-prevent-repeat-click
      v-hasPermissions="['basic:system:roles:save']"
      type="primary"
      @click="submitForm(editFormRef)"
    >
      保存
    </el-button>
  </div>
</template>

<script setup>
const emit = defineEmits(['close', 'submitForm'])
const props = defineProps({
  editData: {
    type: Object,
    default() {
      return {}
    }
  },
  isEdit: Boolean
})
const editFormRef = ref()
const isSelect = ref(true)
const options = ref([])
const selected = ref({})
const selectValue = ref([])
const loading = ref(false)
const form = ref({
  name: '',
  code: '',
  enterIndex: 1,
  remark: '',
  pid: '',
  status: 1
})
const rules = reactive({
  name: [
    {
      required: true,
      message: '请输入',
      trigger: 'blur'
    }
  ],
  code: [
    {
      required: true,
      message: '请输入',
      trigger: 'blur'
    }
  ]
})

onMounted(() => {
  if (props.isEdit) {
    form.value = JSON.parse(JSON.stringify(props.editData))
    // form.enterIndex = form.enterIndex + ''
    console.log(props.editData)
  }
})

const change = () => {
  // eslint-disable-next-line eqeqeq
  if (form.status == 1) {
    form.status = 0
  } else {
    form.status = 1
  }
}
const close = () => {
  emit('close')
}
const loadClose = () => {
  loading.value = false
}
const submitForm = editFormRef => {
  editFormRef.validate(valid => {
    if (valid) {
      loading.value = true
      form.enterIndex = parseInt(form.enterIndex)
      emit('submitForm', form.value)
    }
  })
}
</script>

<style scoped>
.align-center {
  align-items: center;
}
/* 弹窗提交时loading样式需占满整个弹窗 */
.el-loading-parent--relative {
  position: inherit !important;
}
</style>
